<template>
  <div>
    增加:
    <button v-on:click="btnAdd">{{this.$store.state.count}}</button>
    <button v-on:click="btnAddN">{{this.$store.state.count}}</button>
    <button v-on:click="addAync">{{this.$store.state.count}}</button>
    <button v-on:click="addNAync(5)">{{this.$store.state.count}}</button>
  </div>
</template>

<script>
import { mapActions } from 'vuex'
// 方式一： this.$store.state获取
export default {
  name: 'my-addition',
  methods: {
    // 第一种修改数据的方法 this.$store.commit（）
    // Vuex不允许组件直接store全局里面的数据
    // commit 的作用，就是调用 某个 mutation 函数
    btnAdd: function () {
      this.$store.commit('add')
    },
    btnAddN: function () {
      this.$store.commit('addN', 3)
    },
    ...mapActions(['addAync', 'addNAync'])
  }
}
</script>

<style scoped>

</style>
